<{include file='header.html'}>
  <div class="container" style="display:block;">
  	<table class="table table-bordered table-hover">
  		<caption><h3><{$groupInfo.group_name}>  联系人信息 <a style="margin-left:90px;" class="btn btn-mini btn-success add-contact" type="button" href="#editorsave" data-toggle="modal">添加</a></h3></caption>
  	 	<thead><th>姓名</th><th>联系电话</th><th>qq</th><th>常用邮箱</th><th>其他说明</th><th>操作</th></thead>
  	 	<tbody>
  	 		<{foreach from=$userList item=v key=k}>
  	 		<tr><td id="name_<{$v.id}>"><{$v.name}></td><td id="tel_<{$v.id}>"><{$v.tel}></td><td id="qq_<{$v.id}>"><{$v.qq}></td><td id="email_<{$v.id}>"><{$v.email}></td><td id="other_<{$v.id}>"><{$v.other}></td><td><input type="text" style="display:none;" value="<{$v.id}>"/><a class="btn btn-mini btn-success edit-contact" type="button" href="#editorsave" data-toggle="modal">修改</a>&nbsp;&nbsp;<a href="#delModal" data-toggle="modal" class="btn btn-mini btn-danger del-contact" type="button">删除</a></td></tr>
  	 		<{/foreach}>
  	 	</tbody>
  	</table>
    <div id="editorsave" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-header">
    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
    <h3 id="myModalLabel"><span>修改</span>联系方式</h3>
  </div>
  <div class="modal-body">
  	<form class="form-inline" style="margin-left:80px;">
  			<input id="contactId" style="display:none;" type="text" />
  			<input id="groupId" style="display:none;" type="text" value="<{$groupInfo.id}>" />
    		<div class="controls">
     			<label class="control-label" for="inputEmail">姓名:</label>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type="text" class="input-xlarge" id="name" placeholder="姓名">
    		</div><br>
    		
    		<div class="controls">
     			<label class="control-label" for="inputEmail">电话:</label>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type="text" class="input-xlarge" id="tel" placeholder="电话">
    		</div><br>
    		
		    <div class="controls">
		        <label class="control-label" for="inputPassword">QQ:</label> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type="text" id="qq" class="input-xlarge" placeholder="QQ">
		    </div><br>
		    
		    <div class="controls">
		        <label class="control-label" for="inputPassword">邮箱:</label>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type="text" id="email" class="input-xlarge" placeholder="email">
		    </div><br>
		    
		    <div class="controls">
		        <label class="control-label" for="inputPassword">备注:</label>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type="text" id="other" class="input-xlarge" placeholder="其它信息">
		    </div>
	</form>
  </div>
  <div class="modal-footer">
    <button class="btn" data-dismiss="modal" aria-hidden="true">取消</button>
    <button class="btn btn-primary" id="confirm">确认</button>
  </div>
</div>

<div id="delModal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  	<div class="modal-body">
  		<h3 id="myModalLabel">确认删除？</h3>
  	</div>
  	<div class="modal-footer">
  	<input type='text' id='delid' style='display:none' />
    <button class="btn" data-dismiss="modal" aria-hidden="true">取消</button>
    <button class="btn btn-primary" id="delConfirm">确认</button>
  </div>
</div>
  </div>
    <script type="text/javascript">
  	$(document).ready(function(){
  		$('.edit-contact').click(function(){
  			var nodeInput = $(this).context.previousSibling;
  			var id = $(nodeInput).val();
  			$("#myModalLabel span").html("修改");
  			$("#contactId").val(id);
  			$("#name").val($("#name_"+id).html());
  			$("#tel").val($("#tel_"+id).html());
  			$("#qq").val($("#qq_"+id).html());
  			$("#email").val($("#email_"+id).html());
  			$("#other").val($("#other_"+id).html());
  		});
  		  		
  		$(".del-contact").click(function(){
  			var nodeInput = $(this).context.parentNode.children[0];
  			$("#delid").val($(nodeInput).val());  				
  		});
  		
  		
  		$("#delConfirm").click(function(){
  			$.ajax({
  				type:"post",
  				url:"/deluser",
  				dataType:"text",
  				data:'id='+$('#delid').val(),
  				success:function(msg){
  					setTimeout(refresh(), 3000);
  				},
  				error:function(){
  					alert('failed');
  				}
  			}); 
  		})
  		
  		$(".add-contact").click(function(){
  			$("#myModalLabel span").html("添加");
  			$("#name").val('');
  			$("#tel").val('');
  			$("#qq").val('');
  			$("#email").val('');
  			$("#other").val('');
  			$("#contactId").val('');
  		});
  		
  		$("#confirm").click(function(){
  			var name = $("#name").val();
  			var qq = $("#qq").val();
  			var tel = $("#tel").val();
  			var email = $("#email").val();
  			var other = $("#other").val();
  			var group_id = $("#groupId").val();
  			var contact_id = $("#contactId").val();
  			$.ajax({
  				type:"post",
  				url:"/adduser",
  				dataType:"text",
  				data:"name="+name+"&qq="+qq+"&tel="+tel+"&email="+email+"&other="+other+"&group_id="+group_id+"&contact_id="+contact_id,
  				success:function(msg){
  					refresh();
  				},
  				error:function(){
  					alert("failed");
  				}
  			});
  		});
  	});
  	function refresh(){
  		location.reload();
  	}
  </script>
  <{include file='create_group.html'}>